<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Regiones</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	
	{% load staticfiles %} <link rel="stylesheet" href="{% static "css/spacelab.css" %}">
	{% load staticfiles %} <link rel="stylesheet" href="{% static "css/responsive.css" %}">
	{% load staticfiles %} <link rel="stylesheet" href="{% static "css/misestilos.css" %}"> 
	{% load staticfiles %}
        <link rel="stylesheet" href="{% static "css/menu_jquery.css" %}">


        <!-- JS files -->
        {% load staticfiles %} <script type="text/javascript" src="{% static "js/jquery.js" %}"></script>
        {% load staticfiles %} <script type="text/javascript" src="{% static "js/bootstrap.js" %}"></script>
        {% load staticfiles %} <script type="text/javascript" src="{% static "js/menu_jquery.js" %}"></script>
        
</head>
<body>

	{% include "topmenu.html" %} <!-- Top menu -->

	<div class="container">
		<div class="row-fluid">
			
			{% include "sidebar.html" %} <!-- Side bar -->

			<!-- Listado de universidades divididas por regiones -->
			<div class="span9">
				{% if show_message_success %}
	                <div class="alert alert-success">
						<button type="button" class="close" data-dismiss="alert">&times;</button>
		                {{mensaje_exito|safe}}
	                </div>
	            {% endif %}
	            {% if show_message_error %}
	            	<div class="alert alert-error">
						<button type="button" class="close" data-dismiss="alert">&times;</button>
						{{mensaje_error|safe}}                
	                </div>
	            {% endif %}

				<!-- Universidades participantes agrupadas por region -->
				<div class="page-header">
					<h1>Región</h1>
					<a class="btn btn-primary" href="/plataforma/universidades/agregar_region">Agregar Región &raquo </a>
				</div>

				{{lista | safe}}
				<input type="hidden" name="region_id" id = "region_id">

			</div> <!-- /span -->
			
			<!-- Modal -->
			<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h3 id="myModalLabel"><b>Alert!</b></h3>
				</div>
				<div class="modal-body">
					<p><b>¿Está seguro que desea eliminar esta región, junto con todas las universidades (si existiesen) asociadas a ella?</b></p>
					<p>Primero se eliminarán todos los usuarios de aquellas universidades (si existiesen) asociadas a dicha región.</p>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Cancelar</button>
					<a class="btn btn-primary" id="PopUp_Save" onclick = "javascript:eliminarUserUnivRegion()">Eliminar Región</a>
				</div>
			</div><!-- Modal -->
			<div id="modalVer" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
				 <div class="modal-header">
				    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				    <h3 id="modalLabel"><b>Datos de la región</b></h3>
				 </div>
				 <div class="modal-body">
				    	<div class="control-group">
							<label for="name" class="control-label"><b>Nombre:</b></label>
							<div class="nombre"></div>
						</div> <!-- Nombre -->
						
						<div class="control-group">
							<label for="administrator" class="control-label"><b>Administrador:</b></label>
							<div class="administrador"></div>
						</div> <!-- Administrador -->
				 </div>
				 <div class="modal-footer">
				    <button class="btn" data-dismiss="modal" aria-hidden="true">Cerrar</button>
				 </div>
			</div><!-- Modal Ver-->
			<div id="modalUserUnivRegion" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="modalUserUnivRegionLabel" aria-hidden="true">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h3 id="modalUserUnivRegionLabel">Avisos!</h3>
				</div>
				<div class="modal-body">
					<p><b>Eliminando usuarios asociados a aquellas universidades (si existiesen) asociadas a la región.</b>
					<div class="resultElimUserUnivRegion"></div>

				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true" >Aceptar</button>
					<!--<a class="btn btn-primary" id="modalUserUnivRegionButton">Eliminar Región</a>-->
				</div>
			</div><!-- Modal Eliminar Alumnos Universidades-->		

		</div> <!-- /row -->
		{% include "footer.html" %} <!-- Footer -->
	</div> <!-- /container -->
	
	<!-- JS files -->
	{% load staticfiles %} <script type="text/javascript" src="{% static "js/jquery.js" %}"></script>
	{% load staticfiles %} <script type="text/javascript" src="{% static "js/bootstrap.js" %}"></script>

	<script>
	function eliminar(region_id){
		$('#myModal').modal('show');
		$("#region_id").val(region_id);
	}

	function eliminarUserUnivRegion(){
		var region_id = $("#region_id").val();
		$(".close").click();
		ajaxEliminarUserUnivRegion(region_id);
		$('#modalUserUnivRegion').modal('show');
	}

	function ajaxEliminarUserUnivRegion(region_id){
		var mensaje = ""
		$(".resultElimUserUnivRegion").html("<div>Intentando eliminar usuarios de las universidades (si existiesen) asociadas a la región...<p>Por favor espere...</div>");
		$.ajax({
	       type: "POST",
	       url: "/plataforma/universidades/ajax_eliminar_user_univ/",
	       data: {'region_id': region_id},
	       cache: false,
	       success: function(returndata){
	      		$(".resultElimUserUnivRegion").html("<div>"+ returndata.mensaje +"</div>");
	      		if (returndata.exito){
	      			$.get({
					       url: '/plataforma/universidades/admin_region/', 
					       data: { message: "La region ha sido eliminada con exito./exito"} 
					});
	      			//$("#modalUserUnivRegionButton").attr("href", '/plataforma/universidades/admin_region/' + "?message=La region ha sido eliminada con exito./exito");

	      		}else{
	      			//$("#modalUserUnivRegionButton").attr("href", '/plataforma/universidades/admin_region/' + "?message=");
	      			$.get({
					       url: '/plataforma/universidades/admin_region/', 
					       data: { message: ""} 
					});
	      		}
	      		//$("body").html(content);
	       }
	    });
	}
	function verDatos(id_region) {
	    $.ajax({
	       type: "POST",
	       url: "/plataforma/universidades/ajax_region_modal/",
	       data: {'id_region': id_region},
	       cache: false,
	       success: function(returndata){
	            $(".nombre").html(returndata.nombre);           
             	$(".administrador").html(returndata.administrador);

	       }
	    });
	    $('#modalVer').modal('show');

	}
	</script>
</body>
</html>